<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>

     <style>
         *{
             padding: 0;
             margin: 0;
         }

         li{
             list-style: none;
         }
          #k{
             margin-top: 50px;
            float: left;
            margin-left: 30px;
             background: 1px saddlebrown;
             border: 1px solid yellow;
             width: 120px;

         }
     </style>

</head>
<body>
    
    <div id="flod">
        <ul>
            <li id="k">
                <a href="#" id="p">信息管理</a>
                <ul class="wrap">
                    <li> 111 </li>
                    <li> 111 </li>
                    <li> 111 </li>
                </ul>
            </li>

            <li id="k">
                <a href="#" id="p">信息管理</a>
                <ul class="wrap">
                    <li> 111 </li>
                    <li> 111 </li>
                    <li> 111 </li>
                </ul>
            </li>


            <li id="k">
                <a href="#" id="p">信息管理</a>
                <ul class="wrap">
                    <li> 111 </li>
                    <li> 111 </li>
                    <li> 111 </li>
                </ul>
            </li>
        </ul>

         </div>

          <script>
            $(function()
            {
               $(".wrap").css("display","none");

                $("a").bind("mouseenter",function()
                {
                   $(this).parent().find(".wrap").css("display","block");
                })

                $("a").bind("mouseleave",function()
                {

                    $(this).parent().find(".wrap").css("display","none");
                })
            })
          </script>
</body>
</html>